<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
	href="../EXT4/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css"
	href="../css/style.css" />
<script type="text/javascript" src="../EXT4/ext-all.js"></script>
<script type="text/javascript" src="../script/ext-lang-zh_CN.js"></script>
<script type="text/javascript">

Ext.onReady(function() {
	
	Ext.QuickTips.init();
	
	var itemsPerPage = 20; 
    //定义model 
    Ext.define('User', { 
        extend: 'Ext.data.Model', 
        // fields定义字段和数据类型 
        fields: ['id', 'username', 'password','displayName','sex','status'] 
    });
    
    //定义数据集 
    var store = Ext.create('Ext.data.Store', {
        model: 'User', 
        autoLoad: true,
        pageSize: itemsPerPage,
        //使用ajax代理 
        proxy: { 
            type: 'ajax', 
            url: '../service/user_alluser',
            //Reader 解码json数据 
            reader: { 
                type: 'json', 
                root: 'root', 
                total: 'total'
            }
        }
    });
    
    var panel=Ext.create('Ext.Panel', {
        id:'main-panel',
        baseCls:'x-plain',
        renderTo:'sysusermng',
        items:[{
            xtype:'fieldset',
            title: '查询条件',
            collapsible: true,
            defaultType: 'textfield',
            layout: 'hbox',
            items :[{
                fieldLabel: '姓名:',
                id:'dname',
                labelWidth:30,
                width:200,
                margin:'0 10 0 0',
            },{
                fieldLabel: '账号:',
                id:'uname',
                labelWidth:30,
                width:200,
                margin:'0 10 0 0'
            }]
        },Ext.create('Ext.grid.Panel', {
        	store: store,
            columns: [ 
            { 
                text: '账号', width: 100, sortable: true, dataIndex: 'username', editor: 'textfield'
            }, 
            { 
                text: '姓名', width: 120, dataIndex: 'displayName', editor: 'textfield' 
            },{ 
                text: '性别', width: 120, dataIndex: 'sex', editor: 'textfield',
                renderer : function(value, metaData, record, rowIndex, colIndex, store)
				{
					if(value == 0) {
						return "女";
					}
					else{
						return "男";
					}
				}
            },{ 
                text: '启用/禁用', width: 120, dataIndex: 'status', editor: 'textfield',
                falseText:'已启用',trueText:'已经禁用',
                renderer : function(value, metaData, record, rowIndex, colIndex, store)
				{
					if(value == 0) {
						return "已禁用";
					}
					else if(value == 1){
						return "已启用";
					}
				}
            },{ 
            	text: '操作',
                xtype: 'actioncolumn',
                width: 100,
                items: [{
                    icon   : '../EXT4/fam/cog_edit.png"',  // Use a URL in the icon config
                    tooltip: '修改',
                    handler: function(grid, rowIndex, colIndex) {
                    	var rec = grid.getStore().getAt(rowIndex);
                    	Ext.create('Ext.Window', {
                    		id:'updatewin',
                	    	width:640,
                	    	height:400,
                	    	resizable :false,
                	    	draggable : false,
                	    	modal:true,
                	    	title:'用户信息',
                	    	loader: {
                	        	url: 'updateuser',
                	        	params : {
                		        	id:rec.get('id')
                		        },
                	        	loadMask: 'loading...',
                	        	autoLoad: true,
                	        	scripts: true
                	        	},
                	        listeners:{
                	        	'close':function(){
                	        		store.reload();
                	        	}
                	        }
                	    }).show();
                    }
                },{
                    icon   : '../EXT4/fam/cross.gif"',  // Use a URL in the icon config
                    tooltip: '删除',
                    handler: function(grid, rowIndex, colIndex) {
                    	var rec = grid.getStore().getAt(rowIndex);
                    	Ext.MessageBox.confirm("确认","确认删除用户:"+rec.get('displayName'),function(btn){
                    		if(btn=='yes'){
                    			Ext.Ajax.request({  
                    		        url : '../service/user_delete',  
                    		        method : 'GET',  
                    		        params : {
                    		        	id:rec.get('id')
                    		        },
                    		        success:function(form,action){
                    		        	store.reload();
                    		        }
                    		});
                        } 
                    });
                    }
                },{
                    icon   : '../EXT4/fam/accept.gif',  // Use a URL in the icon config
                    tooltip: '启用',
                    handler: function(grid, rowIndex, colIndex) {
                    	var rec = grid.getStore().getAt(rowIndex);
                    	Ext.MessageBox.confirm("确认","确认启用用户:"+rec.get('displayName'),function(btn){
                    		if(btn=='yes'){
                    			Ext.Ajax.request({  
                    		        url : '../service/user_enable',  
                    		        method : 'GET',  
                    		        params : {
                    		        	id:rec.get('id')
                    		        },
                    		        success:function(form,action){
                    		        	Ext.Msg.alert('提示', action.result.msg);
                    		        }
                    		});
                    		}  
                        }); 
                    }
                },{
                    icon   : '../EXT4/fam/delete.gif"',  // Use a URL in the icon config
                    tooltip: '禁用',
                    handler: function(grid, rowIndex, colIndex) {
                    	var rec = grid.getStore().getAt(rowIndex);
                    	Ext.MessageBox.confirm("确认","确认禁用用户:"+rec.get('displayName'),function(btn){
                    		if(btn=='yes'){
                    			Ext.Ajax.request({  
                    		        url : '../service/user_disable',  
                    		        method : 'GET',  
                    		        params : {
                    		        	id:rec.get('id')
                    		        },
                    		        success:function(){
                    		        	Ext.Msg.alert('提示', action.result.msg);
                    		        }
                    		});
                    		}  
                        }); 
                    }
                },{
                    icon   : '../EXT4/fam/cog.png"',  // Use a URL in the icon config
                    tooltip: '重置',
                    handler: function(grid, rowIndex, colIndex) {
                    	var rec = store.getAt(rowIndex);
                    	Ext.MessageBox.confirm("确认","确认重置用户:"+rec.get('displayName'),function(btn){
                    		if(btn=='yes'){
                    			Ext.Ajax.request({  
                    		        url : '../service/user_reset',  
                    		        method : 'GET',  
                    		        params : {
                    		        	id:rec.get('id')
                    		        },
                    		        success:function(){
                    		        	Ext.Msg.alert('提示', action.result.msg);
                    		        }
                    		});
                    		}  
                        }); 
                    }
                }]
            }],
            tbar : [{  
                xtype : 'button',  
                text : '查询',
                handler: function() {
    				var username = escape(Ext.getCmp('uname').getValue());
    				var displayname = escape(Ext.getCmp('dname').getValue());
    				store.loadPage(1,{ params:{'username':username,'displayname':displayname} });
                }
            }, {  
                xtype : 'button',  
                text : '新增',
                handler: function() {
                	Ext.create('Ext.Window', {
                			id:'addwin',
                	    	width:640,
                	    	height:400,
                	    	resizable :false,
                	    	draggable : false,
                	    	modal:true,
                	    	title:'用户信息',
                	    	loader: {
                	        	url: 'adduser',
                	        	loadMask: 'loading...',
                	        	autoLoad: true,
                	        	scripts: true
                	        	},
                	        listeners:{
                	        	'close':function(){
                	        		store.reload();
                	        	}
                	        }
                	    }).show();
                	}
            }],
            //分页 
            dockedItems: [{ 
                xtype: 'pagingtoolbar', 
                store: store,
                dock: 'bottom', 
                displayInfo: true 
                }]
        })]
    });
    
    window.onresize = function(){
    	setTimeout(function(){panel.setWidth(Ext.getDom("sysusermng").width);},100);
	};
	
});
</script>
</head>
<body>
<div id="sysusermng"></div>
</body>
</html>